import { Avatar, Dropdown } from 'antd';
import 'antd/es/avatar/style/index.js';
import 'antd/es/dropdown/style/index.js';
import classnames from 'classnames';
import React, { useMemo } from 'react';
import defaultAvatarImage from './avatar.png';
import './index.less';
/**
 * 头部
 * @param param0
 * @returns
 */
export default function Header(_ref) {
  var className = _ref.className,
    systemLeftAddon = _ref.systemLeftAddon,
    systemRightAddon = _ref.systemRightAddon,
    logo = _ref.logo,
    title = _ref.title,
    userLeftAddon = _ref.userLeftAddon,
    userRightAddon = _ref.userRightAddon,
    renderUserContent = _ref.renderUserContent,
    _ref$avatar = _ref.avatar,
    avatar = _ref$avatar === void 0 ? defaultAvatarImage : _ref$avatar,
    userName = _ref.userName,
    onLogout = _ref.onLogout;
  var userContent = useMemo(
    function () {
      return /*#__PURE__*/ React.createElement(
        'div',
        null,
        avatar !== false &&
          /*#__PURE__*/ React.createElement(Avatar, {
            className: 'szzj-header-user-avatar',
            src: avatar,
            size: 'default',
          }),
        /*#__PURE__*/ React.createElement(
          'span',
          {
            className: 'szzj-header-user-name',
          },
          userName !== null && userName !== void 0 ? userName : '',
        ),
      );
    },
    [userName, avatar],
  );
  return /*#__PURE__*/ React.createElement(
    'div',
    {
      className: classnames('szzj-header', className),
    },
    /*#__PURE__*/ React.createElement(
      'div',
      {
        className: 'szzj-header-system',
      },
      systemLeftAddon &&
        /*#__PURE__*/ React.createElement(
          'div',
          {
            className: 'szzj-header-user-left-addon',
          },
          systemLeftAddon,
        ),
      /*#__PURE__*/ React.createElement(
        'div',
        {
          className: 'szzj-header-system-content',
        },
        logo &&
          /*#__PURE__*/ React.createElement('span', {
            className: 'szzj-header-system-logo',
            style: {
              background: 'url('.concat(logo, ') center center no-repeat'),
              backgroundSize: 'cover',
            },
          }),
        title &&
          /*#__PURE__*/ React.createElement(
            'span',
            {
              key: 'title',
              className: 'szzj-header-system-title',
            },
            title,
          ),
      ),
      systemRightAddon &&
        /*#__PURE__*/ React.createElement(
          'div',
          {
            className: 'szzj-header-user-left-addon',
          },
          systemRightAddon,
        ),
    ),
    /*#__PURE__*/ React.createElement(
      'div',
      {
        className: 'szzj-header-user',
      },
      userLeftAddon &&
        /*#__PURE__*/ React.createElement(
          'div',
          {
            className: 'szzj-header-user-left-addon',
          },
          userLeftAddon,
        ),
      /*#__PURE__*/ React.createElement(
        'div',
        {
          className: 'szzj-header-user-content',
        },
        renderUserContent
          ? renderUserContent(userContent)
          : onLogout
          ? /*#__PURE__*/ React.createElement(
              Dropdown,
              {
                menu: {
                  items: [
                    {
                      key: 'logout',
                      label: '退出登录',
                      onClick: onLogout,
                    },
                  ],
                },
              },
              userContent,
            )
          : userContent,
      ),
      userRightAddon &&
        /*#__PURE__*/ React.createElement(
          'div',
          {
            className: 'szzj-header-user-right-addon',
          },
          userRightAddon,
        ),
    ),
  );
}
